import React from 'react';
import moment from 'moment';
import { convertCurrency } from '@/utils/utils';
import { Table, Descriptions, Card, List } from 'antd';
import UploadUtil from '@/components/UploadUtil';

class ViewPage extends React.Component<any, any> {

  render() {
    const { data, configData } = this.props;
    const dtls = data.items;
    let totalAmt = 0;
    dtls.forEach((record:any) => {
      totalAmt += record.unitCost * record.orderQty
    });
    const columns = [
      {
        title: '分录',
        dataIndex: 'poLine',
        width:70
      },
      {
        title: '物料编码',
        dataIndex: 'partNum',
        width:150
      },
      {
        title: '描述',
        dataIndex: 'lineDesc',
      },
      {
        title: '数量',
        dataIndex: 'orderQty',
        width:80
      },
      {
        title: '单位',
        dataIndex: 'ium',
        width:80
      },
      {
        title: '单价',
        dataIndex: 'unitCost',
        width:100
      },
      {
        title: '金额',
        render: (record: any) => (record.unitCost * record.orderQty),
        width:100
      },
    ];
    return (
      <Card bordered={false} key="C1">
        <Descriptions title={<h2 style={{ textAlign: 'center' }}>采购合同</h2>} bordered>
          <Descriptions.Item label="采购单号" span={2}>{data.poNum}</Descriptions.Item>
          <Descriptions.Item label="采购日期" span={2}>{moment(data.promiseDate).format('YYYY-MM-DD')}</Descriptions.Item>
          <Descriptions.Item label="甲方" span={2}><strong>{data.vendorNum}</strong></Descriptions.Item>
          <Descriptions.Item label="乙方" span={2}><strong>{configData.companyName}</strong></Descriptions.Item>
          <Descriptions.Item label="采购员" span={2}>{data.buyerID}</Descriptions.Item>
          <Descriptions.Item label="供应商" span={2}>{data.vendorNum}</Descriptions.Item>
        </Descriptions>
        <List>
          <List.Item>甲方和乙方经过平等协商，在真实、充分地表达各自意愿的基础上，根据《中华人民共和国合同法》的规定，达成如下协议：</List.Item>
          <List.Item>一、货物名称、计量单位、具体规格型号、数量。</List.Item>
        </List>
        <Table
          columns={columns}
          dataSource={dtls}
          pagination={false}
          bordered
          footer={() => <div style={{textAlign:'right'}}>{'总金额：' + convertCurrency(totalAmt) + '(￥ ' + totalAmt + ')'}</div>}
        />
        <List>
          <List.Item>1.货物的质量标准，按照（国家标准、行业标准、企业标准）执行。</List.Item>
          <List.Item>2.货物的包装物的供应：包装物随货出售，由乙方负责货物包装物供应。乙方应提供货物运至合同规定的交货地点所需要的包装，以防止货物在转运中损坏或变质。这类包装应采取防潮、防晒、防锈、防腐蚀、防震动及防止其它损坏的必要保护措施，从而保护货物能够经受多次搬运、装卸及长途运输。</List.Item>
          <List.Item>二、交货规定</List.Item>
          <List.Item>1.交货方法：由乙方送货(国家主管部门规定有送货办法的，按规定的办法执行；没有规定送货办法的，按双方协议执行)；</List.Item>
          <List.Item>2.运输方式：由乙方自行选择运输方式，运输及保险费用由【甲方】负担。货物交付给甲方之前，货物相关全部风险由乙方承担。</List.Item>
          <List.Item>3.交货地点：甲方</List.Item>
        </List>
        <Descriptions title={false} bordered>
          <Descriptions.Item label="付款方式" span={2}>{data.termsCode}</Descriptions.Item>
          <Descriptions.Item label="运输方式" span={2}>{data.shipViaCode}</Descriptions.Item>
          <Descriptions.Item label="甲方" span={2}>盖章：<br /><br />法定代表人：<br /><br />委托代理人：<br /><br />签订日期：________年____月____日</Descriptions.Item>
          <Descriptions.Item label="乙方" span={2}>盖章：<br /><br />法定代表人：<br /><br />委托代理人：<br /><br />签订日期：________年____月____日</Descriptions.Item>
        </Descriptions>
      </Card>
    );
  }
}
export default ViewPage;
